<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:s="http://www.suricattus.com.br/jsf/ui"
                xmlns:aws="http://awsimple.com/jsf/facelets"
                template="/resources/layout/template.xhtml">

    <ui:define name="title">
        <h:outputText value="#{labels['signup.title']}" />
    </ui:define>

    <ui:define name="body">

        <h:panelGroup id="registerPanel">

            <h:panelGroup rendered="#{!registrarUsuarioController.registrado}">
                <h:form id="userForm" styleClass="form-horizontal">

                    <p:focus context="userForm" />

                    <p:fieldset>

                        <aws:field id="emailField" fieldId="email"
                            label="#{labels['field.email']}" required="true">
                            <p:inputText id="email"
                                value="#{registrarUsuarioController.usuario.email}" required="true"
                                maxlength="256" styleClass="input-xlarge">
                                <s:email />
                            </p:inputText>
                        </aws:field>

                        <aws:field id="passwordField" fieldId="password"
                            label="#{labels['field.password']}" required="true">
                            <p:password id="password"
                                value="#{registrarUsuarioController.usuario.senha}" required="true"
                                styleClass="input-xlarge" match="passwordConfirm"
                                redisplay="true" feedback="true"
                                promptLabel="#{labels['signup.insert.password']}"
                                goodLabel="#{labels['signup.password.good']}"
                                weakLabel="#{labels['signup.password.weak']}"
                                strongLabel="#{labels['signup.password.strong']}">
                                <f:validateLength minimum="6" />
                            </p:password>
                        </aws:field>

                        <aws:field id="passwordConfirmField" fieldId="passwordConfirm"
                            label="#{labels['field.password.confirm']}" required="true">
                            <p:password id="passwordConfirm"
                                value="#{registrarUsuarioController.senhaConfirmar}"
                                required="true" styleClass="input-xlarge" redisplay="true" />
                        </aws:field>

                        <div class="form-actions">
                            <div class="help-inline">
                                <p:commandButton id="registerButton"
                                    action="#{registrarUsuarioController.registrar}"
                                    value="#{labels['action.signup']}"
                                    styleClass="btn btn-primary btn-xlarge" update=":registerPanel" />
                                <p:blockUI block="userForm" trigger="registerButton" />
                            </div>
                        </div>
                    </p:fieldset>

                </h:form>

            </h:panelGroup>

            <h:panelGroup rendered="#{registrarUsuarioController.registrado}">

                <div class="row">
                    <div class="span12">
                        <div class="well">
                            <h3>
                                <h:outputText value="#{messages['congratulations']}" />
                            </h3>
                            <hr />
                            <p>
                                <h:outputText value="#{messages['msgM0103']}" />
                            </p>
                        </div>
                    </div>
                </div>

            </h:panelGroup>

        </h:panelGroup>

    </ui:define>

</ui:composition>
